<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Webhoover v20130527</title>
    <link rel="stylesheet" href="/css/jquery-ui.css">
    <link rel="stylesheet" href="/css/webhoover.css">
    <script src="/js/jquery-1.9.1.min.js"></script>
    <script src="/js/jquery-ui-1.10.2.min.js"></script>
    <script src="/js/jquery.unserializeform.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script src="/js/webhoover.js"></script>
</head>
<body>
<form id='master_form'>

<div id='error'>
    <div id='error_heading'>Error!</div>
    <div id='error_msg'><!-- dynamically filled --></div>
    <div id='error_close'><button type='button' id='close_error' onClick="$('#error').css('display', 'none');">Close</button></div>
</div>

<div id='info'>
    <div id='info_msg'><!-- dynamically filled --></div>
    <div id='info_close'><button type='button' id='close_info' onClick="$('#info').css('display', 'none');">Close</button></div>
</div>

<div id='question'>
    <div id='question_msg'><!-- dynamically filled --></div>
    <div id='question_response'><button type='button' id='question_yes_btn' onClick="javascript:respond('y');">Yes</button>
                                <button type='button' id='question_no_btn' onClick="javascript:respond('n');">No</button></div>
</div>

<div style='clear: both'></div>

<div id='tabs'>

    <ul>
        <li><a href="#connectivity">Connectivity</a></li>
        <li class='mode'><a href="#fuzzing">Fuzzing</a></li>
        <li class='mode'><a href="#drop">Drop</a></li>
        <li class='mode'><a href="#filtering">Filtering</a></li>
        <li class='mode'><a href="#spoofing">Spoofing</a></li>
        <li class='mode'><a href="#logging">Logging</a></li>
        <li class='mode'><a href="#from_file_tab">From File</a></li>
        <li><a href="#save_load">Save/Load</a></li>
    </ul>

    <div id='connectivity'>

        <table class='options_list'>
        <tr>
            <td>Replay mode:</td>
            <td><select onChange='javascript:toggle_replay();' class='config' id='replay' name='replay'>
                <option selected value='0'>disabled</option>
                <option value='1'>enabled</option>
            </select>
            </td>
        </tr>
        <tr class='mode'>
            <td>Proxy mode:</td>
            <td><select class='config' id='proxy' name='proxy'>
                <option selected value='1'>enabled</option>
                <option value='0'>disabled</option>
            </select>
            </td>
        </tr>
        <tr class='mode'>
            <td>Input interface:</td>
            <td><select class='config' id='inputinterfaces' name='input'>    <!-- dynamically created --></select></td>
        </tr>
        <tr class='mode' style='display: none'>
            <td>Replay file:</td>
            <td><input type='text' class='config' id='replay_from' name='replay_from'></td>
        </tr>
        <tr class='mode' style='display: none'>
            <td>Interval:</td>
            <td><input type='text' class='config number' id='replay_interval' name='replay_interval'>ms</td>
        </tr>
        <tr>
            <td>Output interface:</td>
            <td><select class='config' id='outputinterfaces' name='output'>  <!-- dynamically created --></select></td>
        </tr>
        </table>

    </div>

    <div id='fuzzing'>

        Fuzzing: <select class='config' id='fuzzing_enabled' name='fuzzing_enabled' onChange='javascript:toggle_fuzzing();'>
                <option selected value='0'>disabled</option>
                <option value='1'>enabled</option>
            </select>

        <div id='fuzzers' style='display: none'>
            <!-- dynamically created -->
        </div>

        <table id='fuzzing_setup' class='options_list' style='display: none'>
        <tr>
            <td>Probability:</td>
            <td><input type='text' class='number config' name='fprobability' id='fprobability'>% </td>
        </tr>
        <tr>
            <td>Duplicate:</td>
            <td><input type='text' class='number config' name='duplicate' id='duplicate' value=''>% </td>
        </tr>
        <tr>
            <td>Timer:</td>
            <td><input type='text' class='number config' name='ftimer' id='ftimer'>s </td>
        </tr>
        <tr>
            <td>Level:</td>
            <td><select class='config' name='flevel' id='flevel'>
                <option value='1'>1: Link layer</option>
                <option value='2'>2: Network layer</option>
                <option value='3'>3: Transport layer</option>
                <option value='4'>4: Application layer</option>
                <option selected value='10'>Default [10]</option>
             </select>
            </td>
        </tr>
        <tr>
            <td colspan='2'>        Additional <i>--fuzzing-options</i>:<br>
            <input type='text' id='fuzzing_options' name='fuzzing_options' value=''></td>
        </tr>
        </table>

        <br>

    </div>

    <div id='drop'>
        <div class="checkbox_container"><input type="checkbox" class="config" name="drop" value="tcp"> TCP</div>
        <div class="checkbox_container"><input type="checkbox" class="config" name="drop" value="arp"> ARP</div>
        <div class="checkbox_container"><input type="checkbox" class="config" name="drop" value="udp"> UDP</div>
        <div class="checkbox_container"><input type="checkbox" class="config" name="drop" value="icmp"> ICMP</div>
    </div>

    <div id='filtering'>

        <table class='options_list'>
        <tr>
            <td>Source IP:</td>
            <td><input type='text' class='config' name='flt_ipsrc' id='flt_ipsrc'> </td>
        </tr>
        <tr>
            <td>Dest. IP:</td>
            <td><input type='text' class='config' name='flt_ipdst' id='flt_ipdst'> </td>
        </tr>
        <tr>
            <td>Source port:</td>
            <td><input type='text' class='number config' name='flt_srcport' id='flt_srcport'> </td>
        </tr>
        <tr>
            <td>Dest. port:</td>
            <td><input type='text' class='number config' name='flt_dstport' id='flt_dstport'> </td>
        </tr>
        <tr>
            <td>Protocol:</td>
            <td><select class='config' name='flt_protocol' id='flt_protocol'>
                <option value='none'>No protocol filter</option>
                <option value='tcp'>TCP</option>
                <option value='udp'>UDP</option>
             </select>
            </td>
        </tr>
        </table>
    </div>

    <div id='spoofing'>

        <table class='options_list'>
        <tr>
            <td>IPv4 source:</td>
            <td><input type='text' class='config' name='s_ipsrc' id='s_ipsrc'> </td>
        </tr>
        <tr>
            <td>IPv4 dest.:</td>
            <td><input type='text' class='config' name='s_ipdst' id='s_ipdst'> </td>
        </tr>
        <tr>
            <td>IPv6 source:</td>
            <td><input type='text' class='config' name='s_ip6src' id='s_ip6src'> </td>
        </tr>
        <tr>
            <td>IPv6 dest.:</td>
            <td><input type='text' class='config' name='s_ip6dst' id='s_ip6dst'> </td>
        </tr>
        <tr>
            <td>Eth. source:</td>
            <td><input type='text' class='config' name='s_ethsrc' id='s_ethsrc'> </td>
        </tr>
        <tr>
            <td>Eth. dest.:</td>
            <td><input type='text' class='config' name='s_ethdst' id='s_ethdst'> </td>
        </tr>
        </table>
    </div>

    <div id='logging'>

        <table class='options_list'>
        <tr>
            <td>Output file:</td>
            <td><input type='text' class='config' name='loutput' id='loutput'></td>
        </tr>
        
        <tr>
            <td>Format:</td>
            <td><select autocomplete='off' onChange="javascript: toggle_log_format()" class='config' name='lformat' id='lformat'>
                <option selected value='hoover'>Hoover</option>
                <option value='pcap'>PCAP</option>
             </select>
            </td>
        </tr>
        <tr id='lverbose_available'>
            <td>Verbose:</td>
            <td><select class='config' id='lverbose' name='lverbose'>
                <option selected value='0'>disabled</option>
                <option value='1'>enabled</option>
            </select>
            </td>
        </tr>
        <tr id='lunaltered_available' style='display: none'>
            <td>Unaltered:</td>
            <td><select class='config' id='lunaltered' name='lunaltered'>
                <option selected value='0'>do not log</option>
                <option value='1'>log everything</option>
            </select>
            </td>
        </tr>
        </table>
    </div>

    <div id='from_file_tab'>
    Start Network Hoover using the following settings file:<br>
    <input type='text' id='settings_from_file' name='settings_from_file' value=''>
    </div>

    <div id='save_load'>
        <table class='options_list'>
        <tr>
            <td>Load settings:</td>
            <td><select class='config' id='storage_settings_load' name='storage_settings_load'>    <!-- dynamically created --></select></td>
            <td><button type='button' id='storage_settings_load_btn' onClick='javascript:restore_save($("#storage_settings_load option:selected").val())'>Load</button></td>
        </tr>
        <tr>
            <td>Delete settings:</td>
            <td><select class='config' id='storage_settings_delete' name='storage_settings_delete'>    <!-- dynamically created --></select></td>
            <td><button type='button' id='storage_settings_delete_btn' onClick='javascript:delete_save($("#storage_settings_delete option:selected").val())'>Delete</button></td>
        </tr>
        </table>

        Save current state as <input type='text' id='settings_title'>
        <button type='button' id='save_settings' onClick="javascript:save()">Save</button><br>

        <button type='button' id='clear_storage' onClick="javascript:delete_load_entries()">Delete All</button>
    </div>

    <div id='branding'>Webhoover by Juha Kylmänen, <a href='https://www.ee.oulu.fi/research/ouspg/' target='_blank'>OUSPG</a></div>
</div>

<div class='ui-tabs ui-widget ui-widget-content ui-corner-all' id='controlbuttons'>
    <button type='button' id='swap' class='controlbtn' disabled='disabled'>Swap</button>
    <button type='button' id='packetdetails' class='controlbtn' disabled='disabled'>Packet Details</button>
    <button type='button' id='settings' class='controlbtn' disabled='disabled'>View Settings</button>
    <button type='button' id='timer' class='controlbtn' disabled='disabled'>Set Timer</button>
    <button type='button' id='changefuzzer' class='controlbtn' disabled='disabled'>Change Fuzzer</button>
    <button type='button' id='hooverbtn' disabled='disabled'>Start Hoover</button>
</div>

<div style='clear: both'></div>

<div id='log_container' class='ui-tabs ui-widget ui-widget-content ui-corner-all'>
    <div id='log'></div>
    <center><input type='text' id='cmd' style='width: 500px;'> <button type='button' class='controlbtn' disabled='disabled' id='dostuff'>Send</button> 
                <button type='button' id='clearlog' onClick='javascript: $("#log").html("");'>Clear log</button></center>

</div>

</form>

</body>
</html>
